// process-table.js
const ProductionProcessInfo = {
  template: `
    <div class="process-table-container">
      <el-card>
        <div class="table-header">
          <!-- <span class="title">工艺</span> -->
          <!-- <div class="actions">
            <el-button
              type="primary"
              @click="addProcess"
            >添加</el-button>
            <el-button
              type="danger"
              @click="deleteProcess"
            >删除</el-button>
            <el-button
              type="warning"
              @click="replaceProcess"
            >替换</el-button>
          </div> -->
        </div>

        <el-table
          :data="processList"
          border
          stripe
          max-height="50vh"
        >
          <el-table-column
            prop="ROUTENO"
            label="顺序"
            width="80"
            align="center"
          />
          <el-table-column
            prop="WSNAME"
            label="工段"
            width="150"
          />
          <el-table-column
            prop="WPNAME"
            label="工序"
          />
          <el-table-column
            prop="BOMDOSAGE"
            label="单台数"
            width="100"
            align="center"
          />
          <el-table-column
            prop="PREPARETIME"
            label="准备时间"
            width="100"
            align="center"
          />
          <el-table-column
            prop="AVERAGEWORKTIME"
            label="平均工时"
            width="100"
            align="center"
          />
        </el-table>
      </el-card>
    </div>
  `,
  props: {
    // 从父组件接收的工艺数据
    processList: {
      type: [Array, Object],
      required: true,
      default: () => [
        // 默认数据结构和图片中一致
        { order: 1, section: '定子大工段', process: '1010 辅料', quantity: 1, prepTime: 0, avgTime: 41.72, outsourced: '否' },
        { order: 2, section: '定子大工段', process: '2010 插槽纸', quantity: 1, prepTime: 0, avgTime: 7.53, outsourced: '否' },
        // 其他默认数据...
      ],
      validator: (value) => {
        // 验证数据格式
        return true;
        // return value.every(item =>
        //   'order' in item &&
        //   'section' in item &&
        //   'process' in item &&
        //   'quantity' in item &&
        //   'prepTime' in item &&
        //   'avgTime' in item &&
        //   'outsourced' in item
        // );
      }
    }
  },
  methods: {
    addProcess () {
      this.$emit('add-process');
    },
    deleteProcess () {
      this.$emit('delete-process');
    },
    replaceProcess () {
      this.$emit('replace-process');
    }
  }
};

// 注册组件到全局
if (typeof window !== 'undefined' && window.Vue) {
  window.ProductionProcessInfo = ProductionProcessInfo;
}
